<script setup lang="ts">
import { request } from '@/utils/request'
import { debounce } from 'lodash'
import { ref, watch } from 'vue'
const inputValue = ref('')
const searchHistory = ref<string[]>(JSON.parse(localStorage.getItem('searchHistory')!) || [])
watch(searchHistory, () =>
  localStorage.setItem('searchHistory', JSON.stringify(searchHistory.value))
)
const handleSearch = debounce(() => {
  // 存储
  searchHistory.value = [...new Set([inputValue.value, ...searchHistory.value])]
  // 搜索
  getSearchList()
}, 200)

const getSearchList = async () => {
  const resp = await request({
    url: '/health/doctor/sickCircle/v1/searchSickCircle',
    params: {
      keyWord: inputValue.value
    }
  })
  console.log(resp.data.result)
}
</script>

<template>
  <div>
    <div>
      <input type="text" @keyup.enter="handleSearch" v-model="inputValue" />
      <button @click="handleSearch">搜索</button>
    </div>

    <div>
      <h2>历史记录</h2>
      {{ searchHistory }}
    </div>
  </div>
</template>

<style lang="scss" scoped></style>
